import './index.less'
import { PropsType } from '@/utils/interface'
import { useDispatch, useSelector, QuestionModelState,LoginModelState } from 'umi';
import { useEffect } from 'react'
import { Input, Select, Button, Form } from 'antd';
const { Option } = Select;
import Editor from 'for-editor'
const editQuestions: React.FC<PropsType> = (props) => {
    let dispatch = useDispatch()
    useEffect(() => {
        dispatch({
            type: 'question/getQuestions_condition',
            payload: { questions_id: props.match.params.id }
        })
        //获取考试类型
        dispatch({
            type: 'question/getExamType'
        })
        //获取课程类型
        dispatch({
            type: 'question/getSubject'
        })
        //获取试题类型
        dispatch({
            type: 'question/getGetQuestionsType'
        })
        //获取登录用户信息
        dispatch({
            type: 'login/userInfo'
        })
    }, [])
    let { questionsType, examType, subject, getQuestions_newlist } = useSelector((model: { question: QuestionModelState }) => model.question)
    let { loginuser } = useSelector((model: { login: LoginModelState }) => model.login)
    console.log(getQuestions_newlist);
    const onFinish = (values: any) => {
        console.log('Received values of form: ', values);
        
        let { questions_type_id, questions_stem, subject_id, exam_id, questions_answer, title } = values
        dispatch({
            type: "question/postQuestions",
            payload: {
                questions_type_id,
                questions_stem,
                subject_id,
                exam_id,
                user_id: loginuser.user_id,
                questions_answer,
                title
            }
        })
    };
     return  getQuestions_newlist.length?(<div className="editQuestions">
        <h2>编辑试题</h2>
        <div className="addQuestion_conntent">
            <Form
                name="normal_login"
                className="login-form"
                initialValues={{ remember: true }}
                onFinish={onFinish}
            >
                <div className='addtestmain'>
                    <div className='addtestmains'>
                        <div className='addtestmainsTimu'>
                            <div className='addtestmainsTimubox1'>
                                <h1>题目信息</h1>
                                <h3>题干</h3>
                                <Form.Item
                                    name="title"
                                    rules={[{ required: true, message: 'Please input your Username!' }]}
                                    initialValue={getQuestions_newlist[0].title}
                                >
                                    <Input placeholder="题干信息" className='addtestmainsTimuInput' />
                                </Form.Item>
                            </div>
                            <div className='addtestmainsTimubox2'>
                                <h3>题目主题</h3>
                                <Form.Item
                                    name="questions_stem"
                                    initialValue={getQuestions_newlist[0].questions_stem}
                                >
                                    <Editor value={getQuestions_newlist[0].questions_stem}/>
                                </Form.Item>
                            </div>
                        </div>
                        <div className='addtestmainsDaan'>
                            <span>
                                <h3>请选择考试类型:</h3>
                                <Form.Item
                                    name="exam_id"
                                    initialValue={getQuestions_newlist[0].exam_id}
                                >
                                    {examType.length && <Select style={{ width: 320 }} >
                                        {examType.map(item => <Option value={item.exam_id} key={item.exam_name}>{item.exam_name}</Option>)}
                                    </Select>}
                                </Form.Item>
                            </span>
                            <span>
                                <h3>请选择课程类型:</h3>
                                <Form.Item
                                    name="subject_id"
                                    initialValue={getQuestions_newlist[0].subject_id}
                                >
                                    {subject.length && <Select style={{ width: 320 }}>
                                        {subject.map(item => <Option value={item.subject_id} key={item.subject_text}>{item.subject_text}</Option>)}
                                    </Select>}
                                </Form.Item>
                            </span>
                            <span>
                                <h3>请选择题目类型:</h3>
                                <Form.Item
                                    name="questions_type_id"
                                    initialValue={getQuestions_newlist[0].questions_type_id}
                                >
                                    {questionsType.length && <Select style={{ width: 320 }}>
                                        {questionsType.map(item => <Option value={item.questions_type_id} key={item.questions_type_text}>{item.questions_type_text}</Option>)}
                                    </Select>}
                                </Form.Item>
                            </span>
                        </div>
                        <div className='addtestmainsDaan1'>
                            <h1>答案信息</h1>
                            <Form.Item
                                name="questions_answer"
                                initialValue={getQuestions_newlist[0].questions_answer}
                            >
                                <Editor />
                            </Form.Item>
                            <Form.Item
                                name="submit"
                            >
                                <p><Button type="primary" htmlType="submit" className="login-form-button">提交</Button></p>
                            </Form.Item>
                        </div>
                    </div>
                </div>
            </Form>
        </div>
    </div>):( <div></div> )
}
export default editQuestions